<template>
    <el-radio-group size="small" v-model="selectedTime">
        <el-radio-button v-for="option in timeOptions" :key="option.value" :value="option.value" :label="option.label">
        </el-radio-button>
    </el-radio-group>
</template>

<script setup>
import { ref, watch } from 'vue'
import { generateTimeConfig } from '../../utils/date'

const emit = defineEmits(['update:modelValue'])

const props = defineProps({
    isFragmentation: {
        type: Boolean,
        default: false
    }
})

const timeOptions = props.isFragmentation ? [
    { value: 'day', label: '日' },
    { value: 'month', label: '月' },
    { value: 'quarter', label: '季' },
    { value: 'year', label: '年' }
] : [
    { value: 'monthly', label: '本月' },
    { value: 'quarterly', label: '本季度' },
    { value: 'yearly', label: '本年' }
]

const selectedTime = ref(getDefaultValue())

function getDefaultValue() {
    return props.isFragmentation ? 'day' : 'monthly'
}
// 只保留 watch
watch(() => selectedTime.value, (newValue) => {
    const config = generateTimeConfig(newValue)
    emit('update:modelValue', config)
}, { immediate: true })
</script>